<!doctype html>
<html ng-app="myApp">
<head>
  <title>Interpolate String Template Example</title>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.6/angular.js"></script>
</head>
<body>

  <div id="emailEditor" ng-controller="MyController">
    <input ng-model="to"
           type="email"
           placeholder="Recipient" />
    <textarea ng-model="emailBody"></textarea>

    <div id="emailPreview">
      <pre>__ previewText __</pre>
    </div>
  </div>


  <script>
    // to see this example in action open in your browser, type
    // an email address into the email field. Then in the text area
    // box type: Hello {{ to }}.

    angular.module('myApp', ['emailParser'])
      .controller('MyController',
        ['$scope', 'EmailParser',
          function($scope, EmailParser) {
            // Set up a watch
            $scope.$watch('emailBody', function(body) {
              if (body) {
                $scope.previewText =
                  EmailParser.parse(body, {
                    to: $scope.to
                  });
              }
            });
    }]);

    angular.module('emailParser', [])
      .config(['$interpolateProvider',
        function($interpolateProvider) {
          $interpolateProvider.startSymbol('__');
          $interpolateProvider.endSymbol('__');
    }])
    .factory('EmailParser', ['$interpolate',
      function($interpolate) {
        // a service to handle parsing
        return {
          parse: function(text, context) {
            var template = $interpolate(text);
            return template(context);
          }
        };
    }]);
  </script>

</body>
</html>